import {createRouter, createWebHashHistory, createWebHistory} from "vue-router";

// 导入进度条
import NProgress from "nprogress"
// 导入进度条样式
import "nprogress/nprogress.css"


// import Home from "../components/Home.vue";
// import User from "../components/User.vue";
// import Article from "../components/Article.vue";
// import News from "../components/News.vue";
// import Student from "../components/Student.vue";
// import Profile from "../components/Profile.vue";
// import Post from "../components/Post.vue";
// import Content from "../components/Content.vue";
// import Header from "../components/Header.vue";
// import Footer from "../components/Footer.vue";
// import NotFound from "../components/NotFound.vue";

const Home = () => import( "../components/Home.vue")
const User = () => import( "../components/User.vue")
const Article = () => import( "../components/Article.vue")
const News = () => import( "../components/News.vue")
const Student = () => import( "../components/Student.vue")
const Profile = () => import( "../components/Profile.vue")
const Post = () => import( "../components/Post.vue")
const Content = () => import( "../components/Content.vue")
const Header = () => import( "../components/Header.vue")
const Footer = () => import( "../components/Footer.vue")
const NotFound = () => import( "../components/NotFound.vue")


// 创建静态路由表
const routes = [
    {
        path: "/",
        component: Home,
        name: "home"
    },
    {
        path: "/users",
        component: User,
        name: "user"
    },
    {
        path: "/article/:id",
        component: Article,
        name: "article"
    },
    {
        path: "/news/:id",
        component: News,
        name: "news"
    },
    {
        path: "/students/:name",
        component: Student,
        children: [
            {
                path: "profile",
                component: Profile,
                name: "profile"
            },
            {
                path: "post",
                component: Post,
                name: "post"
            }
        ]
    },
    {
        path: '/home',
        redirect: '/'
    },
    {
        path: "/media/:id",
        // component: Content,
        components: {
            default: Content,
            "router-view-header": Header,
            "router-view-footer": Footer,
        },
        name: "media"
    },
    {
        path: "/404",
        component: NotFound,
        name: "404",
    },
    {
        path: "/:notFound(.*)",
        redirect: "/404",

    }
]

//  创建路由对象
let router = createRouter(
    {
        history: createWebHistory(),
        routes: routes,
        linkActiveClass: "active",
        linkExactActiveClass: null,
    }
);

// 注册全局前置守卫， 每个路由进入的时候都要执行
router.beforeEach((to, from, next) => {
    // 开启进度条
    NProgress.start()

    setTimeout(
        () => {

        },
        2000)
    // 放行，进度下一步动作
    // next();
    const item = localStorage.getItem("loggedin");
    // 如果用户处于非登录状态，并且目标页面不是主页，则跳转到主页。
    if (to.path !== '/'){
        if ( item === true.toString()){
            next()
        }
        else {
            next({path: '/'})
        }
    }
    else {
        next()
    }
})

// 注册全局后置守卫，路由切换完成的时候执行
router.afterEach(() => {
    NProgress.done()
})

// 将路由对象导出
export default router

